import React , {RefObject, useEffect} from "react";



//点击之外调用对应的函数hook
//传入对应的ref ， 执行handler
function useClickOuts (ref:RefObject<HTMLElement> , handler: Function) {
    useEffect(function(){
        const lister = (event: MouseEvent)=>{
            if ( !ref.current || ref.current.contains(event.target as HTMLElement)) {
                return;
            }
            handler(event);
        }
        document.addEventListener('click' , lister);

        return function () {
            document.removeEventListener('click' , lister);
        }

    } , [ref, handler]);
};



export default useClickOuts;
